<template>
  <div class="ly-consult ly-add-btn">
    <div class="ly-add-class" @click="$router.push('/addConsult')">新增咨询</div>
    <div class="ly-search">
      <div class="ly-li">
        <span class="ly-label">咨询分类</span>
        <el-select v-model="search.client" placeholder="全部" @change="changeClient">
          <el-option v-for="item in client" :key="item.value" :label="item.label" :value="item.value"></el-option>
        </el-select>
      </div>
      <div class="ly-li">
        <span class="ly-label">咨询名称</span>
        <input type="text" class="ly-input" v-model="search.name" placeholder="请填写咨询名称"/>
      </div>
      <div class="ly-btn">搜索</div>
    </div>
    <div class="ly-table">
      <el-table :data="tableData" style="width: 100%" :max-height="maxHeight" border>
        <el-table-column fixed prop="date" label="序号" width="100"></el-table-column>
        <el-table-column prop="name" label="咨询编号" width="220"></el-table-column>
        <el-table-column prop="name" label="咨询名" width="220"></el-table-column>
        <el-table-column prop="zip" label="咨询分类" width="220"></el-table-column>
        <el-table-column prop="zip" label="大分类" width="220"></el-table-column>
        <el-table-column prop="zip" label="发布日期" ></el-table-column>
        <el-table-column prop="zip" label="发布" width="220">
          <template slot-scope="scope">
            <el-switch v-model="tableData[scope.$index].isRelease" @change="setIsRelease(tableData[scope.$index].date,tableData[scope.$index].isRelease)"></el-switch>
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="160">
          <template slot-scope="scope">
            <span class="ly-btn" @click="getMore(scope.$index,tableData,'up')">编辑</span>
            <span class="ly-btn" @click="getMore(scope.$index,tableData,'down')">删除</span>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <listPage :pageData="pageList" v-if="pageList.totalRecNum >  pageList.pageSize" @getdata="setPageNo"></listPage>
  </div>
</template>


<script>
  export default {
    data() {
      return {
        isRelease: true,
        codeContent: {}, // 弹窗内容
        pageList: {
          page: 1, //当前页
          totalRecNum: 300,   //总页数
          pageSize: 25  // 分页条数
        }, // 分页
        maxHeight: 500,
        search: {
          time: '',
          name: '',
          client: '微信'
        },
        client: [
          {
            value: 'null',
            label: '全部'
          }, {
            value: 'weixin',
            label: '微信'
          }, {
            value: 'qq',
            label: 'QQ'
          }, {
            value: 'xinlang',
            label: '新浪'
          }, {
            value: 'apple',
            label: 'apple'
          }],
        tableData: [
          {
            date: '201',
            name: '王小虎',
            province: '上海',
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            isRelease:false,
            zip: 200333
          }, {
            date: '201602',
            name: '王小虎',
            province: '上海',
            city: '普陀区',
            isRelease:true,
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '20104',
            name: '王小虎',
            province: '上海',
            city: '普陀区',
            isRelease:true,
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '2011',
            name: '王小虎',
            province: '上海',
            isRelease:true,
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '20108',
            name: '王小虎',
            province: '上海',
            isRelease:false,
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '20106',
            name: '王小虎',
            province: '上海',
            isRelease:false,
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '2003',
            name: '王小虎',
            province: '上海',
            city: '普陀区',
            isRelease:false,
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '20162',
            name: '王小虎',
            province: '上海',
            city: '普陀区',
            isRelease:false,
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '2014',
            name: '王小虎',
            province: '上海',
            isRelease:false,
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '20161',
            name: '王小虎',
            province: '上海',
            isRelease:false,
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '2016508',
            name: '王小虎',
            province: '上海',
            isRelease:false,
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '20166',
            name: '王小虎',
            province: '上海',
            isRelease:false,
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '20160507',
            name: '王小虎',
            province: '上海',
            isRelease:false,
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }]
      }
    },
    methods: {
      // switch
      setIsRelease(e,a) {
        console.log(e,a)
      },
      // 选中的分类 内容
      changeClient(e) {
        console.log(e)
      },
      // 查看详情
      getMore(val, rows) {
        console.log(rows[val].date)
      },
      // 获取到的 pageNo
      setPageNo(val) {
        this.pageList.page = val
        // 请求 page页的数据
      },
      // 获取屏幕高度 给table设置最大高度
      getHeight() {
        let vm = this, height = 0
        height = document.documentElement.clientHeight - 265
        vm.maxHeight = height
      },
    },
    created() {
      this.getHeight()
    }
  }
</script>

<style scoped lang="scss">

</style>